<!--合同信息-->
<template>
    <Card>
        <Form :label-width="120" inline>
            <FormItem label="合同ID：" prop="">
                <label>{{data.loanId}}</label>
            </FormItem>
             <FormItem label="状态：" prop="">
                <label>{{this.statusName(data.status)}}</label>
            </FormItem>
             <FormItem label="产品名称：" prop="">
                <label>{{data.productName}}</label>
            </FormItem>
             <FormItem label="产品小类：" prop="">
                <label>{{data.productCode}}</label>
            </FormItem>
             <FormItem label="还款方式：" prop="">
                <label>{{data.repaymentType}}</label>
            </FormItem>
             <FormItem label="年利率：" prop="">
                <label>{{data.rate}}</label>
            </FormItem>
             <FormItem label="延滞天数：" prop="">
                <label>{{data.delqDays}}</label>
            </FormItem>
             <FormItem label="金额：" prop="">
                <label>{{data.loanAmt}}</label>
            </FormItem>
             <FormItem label="起始日期：" prop="">
                <label>{{data.startDate?this.$util.loanModularFormatTime(data.startDate):''}}</label>
            </FormItem>
             <FormItem label="结束日期：" prop="">
                <label>{{data.endDate?this.$util.loanModularFormatTime(data.endDate):''}}</label>
            </FormItem>
        </Form>
        <!-- <div style="margin-top:20px">
            <Row type="flex">
                <Col span="2" order="1" class="row-col-style">合同ID：</Col>
                <Col span="2" order="2" >{{data.loanId}}</Col>
                <Col span="2" order="3" class="row-col-style">状态：</Col>
                <Col span="2" order="4" >{{this.statusName(data.status)}}</Col>
                <Col span="4" order="3" class="row-col-style">产品名称：</Col>
                <Col span="2" order="4" >{{data.productName}}</Col>
                <Col span="4" order="3" class="row-col-style">产品细类：</Col>
                <Col span="2" order="4" >{{data.productType}}</Col>
                <Col span="4" order="3" class="row-col-style">还款方式：</Col>
                <Col span="2" order="4" >{{data.repaymentType}}</Col>
                <Col span="4" order="3" class="row-col-style">年利率：</Col>
                <Col span="2" order="4" >{{data.rate}}</Col>
                <Col span="4" order="3" class="row-col-style">延滞天数：</Col>
                <Col span="2" order="4" >{{data.lateDays}}</Col>
                <Col span="4" order="3" class="row-col-style">金额：</Col>
                <Col span="2" order="4" >{{data.amount}}</Col>
                <Col span="4" order="3" class="row-col-style">期数：</Col>
                <Col span="2" order="4" >{{data.terms}}</Col>
                <Col span="4" order="3" class="row-col-style">起始日期：</Col>
                <Col span="2" order="4" >{{data.startDate?this.$util.loanModularFormatTime(data.startDate):''}}</Col>
                <Col span="4" order="3" class="row-col-style">结束日期：</Col>
                <Col span="2" order="4" >{{data.endDate?this.$util.loanModularFormatTime(data.endDate):''}}</Col>
            </Row>

        </div> -->
        <div style="margin-top:30px">
            <Row type="flex">
                <Col span="3" order="1"></Col>
                <Col span="3" order="2" class="row-col-style">本金</Col>
                <Col span="3" order="3" class="row-col-style">利息</Col>
                <Col span="3" order="4" class="row-col-style">咨询费</Col>
                <Col span="3" order="5" class="row-col-style">管理费</Col>
                <Col span="3" order="6" class="row-col-style">违约金</Col>
                <Col span="3" order="7" class="row-col-style">滞纳金</Col>
            </Row>
            <Row type="flex">
                <Col span="3" order="1" class="row-col-style">已付</Col>
                <Col span="3" order="2" style="text-align:left;">{{data.principal}}</Col>
                <Col span="3" order="3" style="text-align:left;">{{data.interest}}</Col>
                <Col span="3" order="4" style="text-align:left;">{{data.consultingFee}}</Col>
                <Col span="3" order="5" style="text-align:left;">{{data.managementFee}}</Col>
                <Col span="3" order="6" style="text-align:left;">{{data.penaltyFee}}</Col>
                <Col span="3" order="7" style="text-align:left;">{{data.lateFee}}</Col>
            </Row>

            <Row type="flex">
                <Col span="3" order="1" class="row-col-style">未付</Col>
                <Col span="3" order="2" style="text-align:left;">{{data.principalOs}}</Col>
                <Col span="3" order="3" style="text-align:left;">{{data.interestOs}}</Col>
                <Col span="3" order="4" style="text-align:left;">{{data.consultingFeeOs}}</Col>
                <Col span="3" order="5" style="text-align:left;">{{data.managementFeeOs}}</Col>
                <Col span="3" order="6" style="text-align:left;">{{data.penaltyFeeOs}}</Col>
                <Col span="3" order="7" style="text-align:left;">{{data.lateFeeOs}}</Col>
            </Row>
        </div>
    </Card>
</template>
<script>
export default {
  name: 'contract-info-form',
  data () {
    return {
      // contractInfo:{
      //     loanId:'',
      //     status:'',
      //     productName:'',
      //     productType:'',
      //     repaymentType:'',
      //     rate:'',
      //     lateDays:'',
      //     amount:'',
      //     terms:'',
      //     startDate:'',
      //     endDate:'',
      //     principal:'',
      //     interest:'',
      //     consultingFee:'',
      //     managementFee:'',
      //     penaltyFee:'',
      //     lateFee:'',
      //     principalOs:'',
      //     interestOs:'',
      //     consultingFeeOs:'',
      //     managementFeeOs:'',
      //     penaltyFeeOs:'',
      //     lateFeeOs:''
      // },
      // baseUrl: this.$appContext.marvels_core_loanapply,
      // $ajax:null,
    }
  },
  methods: {
    statusName (status) {
      if (status === '0') {
        return '正常'
      }
      if (status === '1') {
        return '逾期'
      }
      if (status === '2') {
        return '结清'
      }
      if (status === '3') {
        return '提前结清'
      }
      if (status === '10') {
        return '核销'
      }
    }
  },
  created: function () {
    this.$ajax = this.$util.ajax()
    //  this.initContractInfo();
  },
  props: {
    data: Object
  }
}
</script>
